{% extends "gideon/layout.html" %}

{% block content %}
    <div class="wrapper wrapper-content">
        <div class="row animated fadeInRight">
            <div class="col-lg-12">
                <div class="ibox ">
                    <div class="ibox-title">
                        <h5> 考勤记录 </h5>
                    </div>
                    <div class="ibox-content">
                        <form method="post">
                            {% csrf_token %}
                            {% comment %}
                            生成的 html 元素为以下，具体含义参考name以及网上和官方文档即可，应该比较好懂
                             <input type="hidden" name="form-TOTAL_FORMS" value="2" id="id_form-TOTAL_FORMS">
                             <input type="hidden" name="form-INITIAL_FORMS" value="2" id="id_form-INITIAL_FORMS">
                             <input type="hidden" name="form-MIN_NUM_FORMS" value="0" id="id_form-MIN_NUM_FORMS">
                             <input type="hidden" name="form-MAX_NUM_FORMS" value="1000" id="id_form-MAX_NUM_FORMS">
                            {% endcomment %}
                            {{ data.formset.management_form }}
                            <table class="table table-hover">
                                <thead>
                                <tr>
                                    <th>#</th>
                                    <th>姓名</th>
                                    <th>考勤</th>
                                </tr>
                                </thead>
                                <tbody>
                                {% for form in data.formset %}
                                    <tr>
                                        {{ form.id }}
                                        <td>{{ forloop.counter }}</td>
                                        <td>{{ form.instance.student }}</td>
                                        <td>{{ form.record }} <span style="color: red">{{ form.record.errors.0 }}</span>
                                        </td>
                                    </tr>
                                {% endfor %}
                                </tbody>
                            </table>
                            <div class="clearfix">
                                <button class="btn btn-success btn-rounded float-right" type="submit">Success</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}